import React, { Component } from 'react'
import {connect} from "react-redux";
import {bindActionCreators} from "redux";
import Banner from "./components/Banner/Banner";
import Cate from "./components/Cate/Cate";
import Goods from "./components/Goods/Goods";
import Header from '../../components/Header/Header';
import { actions,
        getBanner,
        getCates,
        getN,
        showGoods, } from '../../store/modules/Home';

class Home extends Component {
    componentDidMount(){
        let {home:{requestBanner,requestCates,requestGoods},} = this.props;
        requestBanner();
        requestCates();
        requestGoods();
    }
    render() {
        let{ cates,banner,n,showGoods,home:{changeN}}=this.props;
        return (
            <div>
                <Header title="首页"></Header>
                <Cate cates={cates}></Cate>
                <Banner banner={banner}></Banner>
                <Goods showGoods={showGoods} n={n} changeN={n=>changeN(n)}></Goods>
            </div>
        )
    }
}

//取数据
const mapStateToProps = (state) => {
    return {
        cates:getCates(state),
        banner:getBanner(state),
        showGoods: showGoods(state),
        n:getN(state)
    };
}

//取方法
const mapDispatchToProps = (dispatch) =>{
    return {
        home:bindActionCreators(actions,dispatch)
    };
}

export default connect(mapStateToProps,mapDispatchToProps)(Home)